<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <img
      src="https://img1.baidu.com/it/u=422078137,1307526884&fm=253&fmt=auto&app=120&f=JPEG?w=1280&h=800"
      alt=""
    />
    <script>
      async function syncMessagesLater() {
        await navigator.serviceWorker.register("./service-worker.js");
        const registration = await navigator.serviceWorker.ready;
        try {
          await registration.sync.register("sync-messages");
          navigator.serviceWorker.ready.then((registration) => {
            registration.sync.getTags().then((tags) => {
              console.log(tags);
              if (tags.includes("sync-messages"))
                console.log("Messages sync already requested");
            });
          });
        } catch {
          console.log("Background Sync could not be registered!");
        }
      }

      syncMessagesLater();
    </script>
  </body>
</html>
